
// Global Method
//

// This function for set the position of Anchor depend on the position and size of the control
function setPosition(type, controlPosX, controlPosY, controlWidth, controlHeight, hDiv) {
	var width = parseInt(hDiv.style.width);
	var height = parseInt(hDiv.style.height);
	
	switch(type) {
		case 'tl':
			hDiv.style.left = controlPosX - width / 2 + 'px';
			hDiv.style.top = controlPosY - 3 * height / 2 + 'px';
		break;
			
		case 'tm':
			hDiv.style.left = controlPosX + controlWidth / 2 + 'px';
			hDiv.style.top = controlPosY - 3 * height / 2 + 'px';
		break;
		
		case 'tr':
			hDiv.style.left = controlPosX + controlWidth + 'px';
			hDiv.style.top = controlPosY - 3 * height / 2 + 'px';
		break;
		
		case 'ml':
			hDiv.style.left = controlPosX - 3 * width / 2 + 'px';
			hDiv.style.top = controlPosY + controlHeight / 2 - height / 2 + 'px';
			
		break;
		
		case 'mr':
			hDiv.style.left = controlPosX + controlWidth  +  width / 2 + 'px';
			hDiv.style.top = controlPosY + controlHeight / 2 - height / 2 + 'px';
			
		break;
			
		case 'bl':
			hDiv.style.left = controlPosX - width / 2 + 'px';
			hDiv.style.top = controlPosY + controlHeight + height / 2 + 'px';
			
		break;
		
		case 'bm':
			hDiv.style.left = controlPosX + controlWidth / 2 + 'px';
			hDiv.style.top = controlPosY + controlHeight + height / 2 + 'px';
			
		break;
		
		case 'br':
			hDiv.style.left = controlPosX + controlWidth + 'px';
			hDiv.style.top = controlPosY + controlHeight + height / 2 + 'px';
			
		break;
	}
}

// Class Anchor
//

function Anchor(_type, controlId, controlPosX, controlPosY, controlWidth, controlHeight, width, height, controller, border, color, selectedColor) { 
	// Properties
	//
	this.controller = controller;
	
	// Fields
	//
	
	var type = _type;
	var hDiv = document.createElement('div');
	
	// Set attribute
	hDiv.style.width = width + 'px';
	hDiv.style.height = height + 'px';
	hDiv.style.position = 'absolute';
	hDiv.style.border = border;
	hDiv.style.borderRadius = '1em';
	hDiv.style.background = color;
	
	// Set event
	hDiv.addEventListener("mousedown", mouseDown, false);
	hDiv.addEventListener("mousemove", mouseMove, false);
	hDiv.addEventListener("mouseup", mouseUp, false);
	hDiv.addEventListener("mouseover", mouseOver, false);
	hDiv.addEventListener("mouseout", mouseOut, false);

	// Set Class Name
	hDiv.className = controlId + '-' + type;
	
	// Set visible
	hDiv.style.visibility = "hidden";
	
	// Set Position and Cursor
	setPosition(type, controlPosX, controlPosY, controlWidth, controlHeight, hDiv);
	
	// Set the cursor type when the mouse hover the anchor
	switch(type) {
		case 'tl':
			
			hDiv.style.cursor = "nw-resize";
		break;
			
		case 'tm':
			
			hDiv.style.cursor = "n-resize";
		break;
		
		case 'tr':
			
			hDiv.style.cursor = "ne-resize";
		break;
		
		case 'ml':
			
			hDiv.style.cursor = "w-resize";
		break;
		
		case 'mr':
			
			hDiv.style.cursor = "e-resize";
		break;
			
		case 'bl':
			
			hDiv.style.cursor = "sw-resize";
		break;
		
		case 'bm':
			
			hDiv.style.cursor = "s-resize";
		break;
		
		case 'br':
			
			hDiv.style.cursor = "se-resize";
		break;
	}
	
	// Add the anchor to the body of HTML
	document.body.appendChild(hDiv);
	
	// Public Method
	//
	
	// Visible function
	this.setVisible = function() {
		hDiv.style.visibility = "inherit";
	};

	this.setInvisible = function() {
		hDiv.style.visibility = "hidden";
	};
	
	// Getter Method
	//
	
	this.getAnchor = function() {
		return hDiv;
	};
	
	this.getType = function() {
		return type;
	};
	
	// Private Method For set the offset of the mouse
	//
	var offsetX = 0;
	var offsetY = 0;
	var lastMousePosX = 0;
	var lastMousePosY = 0;
	var isClick = false;
	
	function cancelEvent(e,c){
		e.returnValue=false;
		if(e.preventDefault)
			e.preventDefault();
		if(c){
			e.cancelBubble=true;
			if(e.stopPropagation)e.stopPropagation();
		}
	}

	function mouseDown(e){

	  offsetX = 0;
	  offsetY = 0;
	  lastMousePosX = e.clientX;
	  lastMousePosY = e.clientY;
	  isClick = true;
	  cancelEvent(e);
	}
	
	function mouseMove(e){
		
		if(!isClick)
			return; 
			
		// Calc the offset of mouse move
		var mouseX = e.clientX;
		var mouseY = e.clientY;
		
		var offsetX = mouseX - lastMousePosX;
		var offsetY = mouseY - lastMousePosY;
		
		lastMousePosX = mouseX;
		lastMousePosY = mouseY;
		
		// Update the new position and the size
		controller.update(offsetX, offsetY, type);
		
	}
	
	function mouseUp(e){
		isClick = false;
	}
	
	function mouseOver(e) {
		hDiv.style.background = selectedColor;
	}
	
	function mouseOut(e){
		hDiv.style.background = color;
		isClick = false;
	}
}

// Public Method
//

// This method for update the position of the anchor by calling the setPosition Method
Anchor.prototype.updatePosition = function(type, controlId, hDiv) {
	var element = document.getElementById(controlId);
	var controlPosX = parseInt(element.offsetLeft);
	var controlPosY = parseInt(element.offsetTop);
	var controlWidth = parseInt(element.style.width);
	var controlHeight = parseInt(element.style.height);
	setPosition(type, controlPosX, controlPosY, controlWidth, controlHeight, hDiv);			
}
	